<template>
    <el-container class="container">
        <el-aside width="200px">
            <el-menu class="el-menu"  :collapse="isCollapse">
                <questionList></questionList>
            </el-menu>
        </el-aside>
        <el-container>
            <el-main>
                <chatContainer></chatContainer>
            </el-main>
            <el-footer>
                <chatFooter></chatFooter>
            </el-footer>
        </el-container>
    </el-container>
</template>



<script>
import questionList from "../components/chat/questionList.vue"

import chatContainer from "../components/chat/chatContainer.vue"

import chatFooter from '@/components/chat/chatFooter.vue'
export default {
    components: {
        questionList,
        chatContainer,
        chatFooter
    },
    data() {

        return {
            isCollapse: false
        }
    }
}
</script>

<style lang="scss" scoped>
.container {
    height: 100vh;
    width: 100vw;
    display: flex;

    .el-menu {
        height: 100vh;
        padding: 20px;
        box-sizing: border-box;
    }
}
</style>